<template>
  <a-modal
    :title="currTitle"
    :width="450"
    :visible="visible"
    :closable="false"
    :maskClosable="closable">
    <template slot="footer">
      <a-button v-if="closable" @click="close">关闭</a-button>
      <a-button type="primary" @click="departOk">确认</a-button>
    </template>

    <a-form>
      <a-form-item
        :labelCol="{span:4}"
        :wrapperCol="{span:20}"
        style="margin-bottom:10px"
        :validate-status="validate_status">
        <a-tooltip placement="topLeft" >
          <template slot="title">
            <span>您隶属于多部门，请选择当前所在部门</span>
          </template>
          <a-avatar style="backgroundColor:#87d068" icon="gold" />
        </a-tooltip>
        <a-select v-model="departSelected" :class="{'valid-error':validate_status=='error'}" placeholder="请选择登录部门" style="margin-left:10px;width: 80%">
          <a-icon slot="suffixIcon" type="gold" />
          <a-select-option
            v-for="d in departList"
            :key="d.orgId"
            :value="d.orgId">
            {{ d.orgName }}
          </a-select-option>
        </a-select>
      </a-form-item>
    </a-form>


  </a-modal>
    
</template>

<script>
  import { getAction } from '@/api/manage'
  import store from '@/store/'

  export default {
    name: 'DepartSelect',
    props:{
      title:{
        type:String,
        default:"部门选择",
        required:false
      },
      closable:{
        type:Boolean,
        default:false,
        required:false
      },
    },
    data(){
      return {
        currTitle:this.title,
        visible:false,
        departList:[],
        departSelected:undefined,
        validate_status:"",
        currDepartName:"",
      }
    },
    methods:{
      loadDepartList(){
		getAction("/sys/user/query/current/deptlist").then(res => {
			if(res.code == '00000') {
				this.departList = res.data
				for(let i = 0; i < res.data.length; i++) {
					if(res.data[i].selectedFlag) {
						this.currTitle ="部门切换（当前部门 : " + res.data[i].deptName + "）"
					}
				}
			} else {
				this.$message.warning("获取机构信息失败!")
				setTimeout(()=> {
					this.departClear()
				}, 500)
			}
		})
      },
      close(){
        this.departClear()
      },
      departOk(){
        if(!this.departSelected){
          this.validate_status='error'
          return false
        }
		getAction("/sys/user/select/org/" + this.departSelected).then(res => {
			if(res.code == '00000') {
				this.departClear()
				this.$router.push({ path: '/dashboard/analysis' });
				store.commit('SET_PERMISSIONLIST', []);
				location.reload()
			} else {
				this.$message.warning("切换机构失败:" + res.msg)
				this.departClear()
			}
		})
      },
      show(){
		this.visible = true
		this.loadDepartList()
      },
      departClear(){
        this.departList=[]
        this.departSelected = undefined
        this.visible=false
        this.validate_status=''
        this.currDepartName=""
      },
    }

  }
</script>
<style scoped>
  .valid-error .ant-select-selection__placeholder{
    color: #f5222d;
  }
</style>